<template>
     <div class="loginMainContainer">
        <div class="loginMainForm">
            <div class="loginMainUser">
                <div class="loginMainUserLogo"></div>
                <div class="loginMainUserTextF">
                    <input type="search" class="loginMainUserText" placeholder="请输入电话" v-model='submitData.account'>
                </div>
            </div>
            <div class="loginMainPwd">
                <div class="loginMainPwdLogo loginMainCodeType"></div>
                <div class="loginMainPwdTextF">
                    <input type='password'
                        placeholder='请输入验证码'
                        class="loginMainPwdText" 
                        v-model='submitData.password'
                        >
                    <div class="loginMainGetCode" :class="userNameValidate?'canSubmit':''" @click='getPhoneCode'>获取验证码</div>
                </div>
            </div>
        </div>
        <div class="loginMainSubmitF">
            <div class="loginMainSubmit" :class="userNameValidate && passWordValidate?'canSubmit':''" @click='signUpSubmit'>立即注册</div>
        </div>
    </div>    
</template>

<script>
import axios from 'axios'
export default {
    data(){
        return{
            userNameValidate:0,
            passWordValidate:0,
            submitData:{
                account:'',
                password:''
            }
        }
    },
    methods:{
         getPhoneCode(){
            if(this.userNameValidate){
                axios({
                    method:'POST',
                    url:'/api/loginAndReg/sendSmsCode',
                    data:{
                        'phoneNumber':this.submitData.account.toString()
                    },
                }).then((result) => {
                    console.log(result);
                }).catch((err) => {
                   console.log(err); 
                });
            }
        },
        signUpSubmit(){
             if(this.userNameValidate && this.passWordValidate){
                axios({
                    method:'POST',
                    url:'/api/loginAndReg/loginByMobile',
                    data:{
                        'phoneNumber':this.submitData.account,
                        'smsCode':this.submitData.password,
                        "refereeCompId": "string",
                        "refereeUserId": "string",
                    },
                }).then((result) => {
                    console.log(result);
                }).catch((err) => {
                   console.log(err); 
                });
            }
        }
    },
    watch:{
        'submitData.account':function(){
            if(!(/^1[34578]\d{9}$/.test(this.submitData.account))){ 
                this.userNameValidate = 0
            }else{
                this.userNameValidate = 1
            }
        },
        'submitData.password':function(){
           if(this.submitData.password.length < 4){
               this.passWordValidate = 0
           }else{
               this.passWordValidate = 1
           }
        }
    }
}
</script>

<style>

</style>
